<include file="Public/header" />
<div class="page">
  <div class="fixed-bar">
    <div class="item-title">
      <h3>规格管理</h3>
      <ul class="tab-base">
        <li><a href="{:U('Spec/spec')}"><span>管理</span></a></li>
        <li><a class="current" href="JavaScript:void(0);"><span>编辑</span></a></li>
      </ul>
    </div>
  </div>
  <div class="fixed-empty"></div>
  <form id="spec_form" method="post" enctype="multipart/form-data">
    <input type="hidden" name="s_id" value="{$sp_list['sp_id']}" />
    <table class="table tb-type2">
      <tbody>
        <tr class="noborder">
          <td class="required" colspan="2"><label class="validation" for="s_name">规格名称</label></td>
        </tr>
        <tr class="noborder">
          <td class="vatop rowform"><input type="text" class="txt" name="s_name" id="s_name" value="{$sp_list['sp_name']}" /></td>
          <td class="vatop tips">请填写常用的商品规格的名称；例如：颜色；尺寸等。</td>
        </tr>
        <tr>
          <td class="required" colspan="2"><label class="validation" for="s_sort">排序</label></td>
        </tr>
        <tr class="noborder">
          <td class="vatop rowform"><input type="text" class="txt" name="s_sort" id="s_sort" value="{$sp_list['sp_sort']}" /></td>
          <td class="vatop tips">请填写自然数。规格列表将会根据排序进行由小到大排列显示。</td>
        </tr>
        <tr>
          <td class="required" colspan="2"><label>规格类型</label></td>
        </tr>
        <tr class="noborder">
          <td class="vatop rowform">
          <ul>
          	<if condition="$sp_list['sp_id'] neq 1">
              <li>
                <input type="radio" name="s_dtype" id="s_dtype_text" value="text" <if condition="$sp_list['sp_format'] eq 'text'">checked="checked" </if>/>
                <label for="s_dtype_text">文字</label>
              </li>
            </if>
              <li>
                <input type="radio" name="s_dtype" id="s_dtype_image" value="image" <if condition="$sp_list['sp_format'] eq 'image'">checked="checked" </if>/>
                <label for="s_dtype_image">图片</label>
              </li>
           </ul>
          </td>
          <td class="vatop tips">图片类型的规格值用于直观表现某些特殊规格类型，例如颜色规格，可用对应的色彩图片来表现其各种颜色值。</td>
        </tr>
      </tbody>
    </table>
    <table class="table tb-type2 ">
      <thead class="thead">
        <tr class="space">
          <th colspan="15">添加规格值</th>
        </tr>
        <tr class="noborder">
          <th>删除</th>
          <th>排序</th>
          <th>规格值</th>
          <th class="image_display">规格图片</th>
          <th></th>
          <th class="align-center">操作</th>
        </tr>
      </thead>
      <tbody id="tr_model">
        <tr></tr>
        <notempty name="sp_value">
        <volist name="sp_value" id="val">
        <tr class="hover edit">
          <input type="hidden" nc_type="submit_value" name='s_value[{$val['sp_value_id']}][form_submit]' value='' />
          <input type="hidden" nc_type="ajax_spec_value_id" value="{$val['sp_value_id']}" />
          <td class="w48"><input type="checkbox" name="s_del[{$val['sp_value_id']}]" value="{$val['sp_value_id']}" /></td>
          <td class="w48 sort"><input type="text" nc_type="change_default_submit_value" name="s_value[{$val['sp_value_id']}][sort]" value="{$val['sp_value_sort']}" /></td>
          <td class="w270 name"><input type="text" nc_type="change_default_submit_value" name="s_value[{$val['sp_value_id']}][name]" value="{$val['sp_value_name']}" /></td>
          <td class="w300 vatop rowform image_display">
            <if condition="$val['sp_value_image'] neq ''">
              <input type="hidden" name='s_value[{$val['sp_value_id']}][image]' value='{$val['sp_value_image']}'/>
            </if>
            <span class="type-file-show"><img class="low_source" width="16" height="16" src="<if condition="$val['sp_value_image'] eq ''">__IMG__/transparent.gif'<else/>__UPLOADS__{$val['sp_value_image']}</if>" /></span><span class="type-file-box">
            <input type="text" name="textfield" class="type-file-text" /><input type="button" name="button" value="" class="type-file-button" />
            <input class="type-file-file" type="file" title="" nc_type="change_default_goods_image" hidefocus="true" size="30" name="s_value_{$val['sp_value_id']}" id="s_value_key">
            </span></td>
          <td></td>
          <td class="w150 align-center"></td>
        </tr>
        </volist>
        <else/>
        <tr class="no_data">
          <td colspan="15">还没有添加规格值信息</td>
        </tr>
        </notempty>
      </tbody>
      <tbody>
        <tr>
          <td colspan="15"><a class="btn-add marginleft" id="add_type" href="JavaScript:void(0);"> <span>添加一个规格值</span> </a></td>
        </tr>
      </tbody>
    </table>
    <table class="table tb-type2">
      <tbody>
<!--        <tr>
          <td colspan="2" class="required"><label><?php echo $lang['spec_edit_type_off_shelf'];?></label></td>
        </tr>
        <tr class="noborder">
          <td class="vatop rowform onoff"><label for="off_shelf1" class="cb-enable"><span><?php echo $lang['nc_yes'];?></span></label>
            <label for="off_shelf0" class="cb-disable selected"><span><?php echo $lang['nc_no'];?></span></label>
            <input id="off_shelf1" name="off_shelf" value="1" type="radio" />
            <input id="off_shelf0" name="off_shelf" checked="checked" value="0" type="radio" />
          </td>
          <td class="vatop tips"></td>
        </tr>-->
      </tbody>
      <tfoot>
        <tr class="tfoot">
          <td colspan="15"><a id="submitBtn" class="btn" href="JavaScript:void(0);"> <span>提交</span> </a></td>
        </tr>
      </tfoot>
    </table>
  </form>
</div>
<script type="text/javascript">
$(function(){
    var i=0;
	var tr_model = '<tr class="hover edit">'+
		'<td></td><td class="w48 sort"><input type="text" name="s_value[key][sort]" value="0" /></td>'+
		'<td class="w270 name"><input type="text" name="s_value[key][name]" value="" /></td>'+
		'<td class="w300 image_display vatop rowform">'+
			'<span class="type-file-show">'+
				'<img class="low_source" width="16" height="16" src="__IMG__/transparent.gif" />'+
			'</span>'+
			'<span class="type-file-box">'+
				'<input type="text" name="textfield" class="type-file-text" /><input type="button" name="button" value="" class="type-file-button" />'+
				'<input class="type-file-file" type="file" title="" nc_type="change_default_goods_image" hidefocus="true" size="30" name="s_value_key" id="s_value_key">'+
			'</span>'+
		'</td>'+
		'<td></td><td class="w150 align-center"><a onclick="remove_tr($(this));" href="JavaScript:void(0);">移除</a></td>'+
	'</tr>';
	$("#add_type").click(function(){
		$('#tr_model > tr:last').after(tr_model.replace(/key/g,'s_'+i));
		if($('.image_display').is(":hidden")){
			$('.image_display').hide();
		}
		<?php if(empty($sp_value)){?>
		$('.no_data').hide();
		<?php }?>
		$.getScript("__JS__/admincp.js");
		i++;
	});

	//规格图片显示与隐藏操作
	<?php if($sp_list['sp_format'] == 'text'){?>
	$('.image_display').hide();
	<?php }?>
	$('#s_dtype_image').click(function(){
		$('.image_display').show();
	});
	$('#s_dtype_text').click(function(){
		$('.image_display').hide();
	});

	//表单验证
    $('#spec_form').validate({
        errorPlacement: function(error, element){
			error.appendTo(element.parent().parent().prev().find('td:first'));
        },
        success: function(label){
            label.addClass('valid');
        },
        onkeyup    : false,
        rules : {
        	s_name: {
        		required : true,
                maxlength: 10,
                minlength: 1
            },
            s_sort: {
				required : true,
				digits	 : true
            }
        },
        messages : {
        	s_name : {
            	required : '请填写规格名称',
                maxlength: '规格名称长度应在1-10个字符之间',
                minlength: '规格名称长度应在1-10个字符之间'
            },
            s_sort: {
				required : '请填写规格排序',
				digits   : '请填写整数'
            }
        }
    });

    //按钮先执行验证再提交表单
    $("#submitBtn").click(function(){
        if($("#spec_form").valid() && confirm('注意：请谨慎操作！')){
        	$("#spec_form").submit();
    	}
    });

    //预览图片
    $("input[nc_type='change_default_goods_image']").live("change", function(){
		var src = getFullPath($(this)[0]);
		$(this).parent().prev().find('.low_source').attr('src',src);
	});

    $("input[nc_type='change_default_goods_image']").change(function(){
		$(this).parents('tr:first').find("input[nc_type='submit_value']").val('ok');
	});

    $("input[nc_type='change_default_submit_value']").change(function(){
    	$(this).parents('tr:first').find("input[nc_type='submit_value']").val('ok');
    });
	
});

function remove_tr(o){
	o.parents('tr:first').remove();
}
</script> 
<script type="text/javascript">
$(function(){
	$('input[nc_type="change_default_goods_image"]').live("change", function(){
		$(this).parent().find('input[class="type-file-text"]').val($(this).val());
	});
});
</script> 
<include file="Public/footer" />